<!-- td-info 表格单元格 -->
<template>
    <!-- selection框 -->
    <el-table-column v-if="type === 'selection'" type="selection" :width="width || '45px'" :min-width="minWidth"></el-table-column>
    <!-- 其它 -->
    <el-table-column 
            v-else 
            :label="name" :width="width" :min-width="minWidth" 
            :show-overflow-tooltip="['textarea', 'rich-text'].indexOf(type)  !== -1"
            >
        <template #default="s">
            <!-- text 文本 -->
            <span v-if="type === 'text'">{{ s.row[prop] }}</span>
            <!-- num 数字 -->
            <span v-else-if="type === 'num'" class="tc-num">{{ s.row[prop] }}</span>
            <!-- icon 数字 -->  
             <span v-else-if="type === 'icon'" style="font-size: 15px;"> 
             <component class="icons"  :is="s.row[prop]" style="font-size: 5px; " width="20"></component>
          
               
            </span>
         
            <!-- money 钱 (单位 元) -->
            <b v-else-if="type === 'money'" class="c-price">￥{{ s.row[prop] }}</b>
            <!-- money-f 钱 (单位 分) -->
            <b v-else-if="type === 'money-f'" class="c-price">￥{{ s.row[prop] / 100 }}</b> 
            <!-- link 链接 -->
            <el-link v-else-if="type === 'link'" type="primary" :href="s.row[prop]" target="_blank">{{ s.row[prop] }}</el-link> 
     
            <!-- rate 评分 -->
            <p v-else-if="type === 'rate'">
                <el-rate v-model="s.row[prop]" disabled style="line-height: 0; vertical-align: middle;"></el-rate>
                <span style="vertical-align: middle; color: #666;">{{s.row[prop]}}</span>
            </p>

            <!-- img 图片 -->
              <div  v-else-if="type === 'img'" class="demo-image__preview">
                <el-image
                style="width: 100px; height: 100px"
                :src="s.row[prop]" 
                
                :preview-src-list="[s.row[prop]]"
                :initial-index="1"
                fit="cover"
                />
            </div>
     
             
      
            <!-- 头像 -->
            <template v-else-if="type === 'avatar'">
              
                    <img :src="s.row[prop.split(',')[0]]" class="td-img"  style=" width:40px"
                        alt="img" />
                    
               
            </template>
        
            <template v-else>
               {{ s.row[prop] }} 
            </template>
        </template>
    </el-table-column>
    
    
</template>
<script>

export default {
  name: "JmTb",
   props:{
		   // 类型 
        type: {
            default: 'text'
        },
        // label提示文字
        name: {},
        label: {},
        // 绑定的属性  
        prop: {},
        // 宽度 
        width: {},
        // 最小宽度
        minWidth: {},
        // type=menu时，值列表    -- 形如：{1: '正常[green]', 2: '禁用[red]'}  
        jv: {default: ''},
        // 空值时显示的文字
        not: {default: '无'}
	},
 
  
};	
</script>
<style scoped>
.demo-image__error .image-slot {
  font-size: 30px;
}
.demo-image__error .image-slot .el-icon {
  font-size: 30px;
}
.demo-image__error .el-image {
  width: 100%;
  height: 200px;
}
</style>